/**
 * Created by work on 17/3/15.
 */
import React from 'react'
import PropTypes from 'prop-types';
import Picker from './Picker';
import Config from '../../../Config'
import styles from "../../../css/flex.module.css";
import {pickerStyle as style} from "../../../const/datas.js";
class Panel extends React.Component {
  constructor(props) {
    super(props);
    this.list = []
    this.props.list.forEach(item => {
      this.list.push(item)
    });
    this.state = {
      selectedOption: this.props.list[0],
    };
   
  }
  render() {
    
    let opt = (
      <div style={style.box}  className={styles.flex_justify_between}>
        <Picker
          options={this.list}
          onChange={(value) => this.setState({selectedOption: value})}
          show={this.props.show}
        />
      </div>
    );
    return (
      <div
        style={Object.assign({}, style.shadow, {display: this.props.show ? 'block' : 'none'})}
      >
        <div style={style.panel}>
        <div style={style.action} className={styles.flex_justify_between}>
            <div
              style={style.cancel}
              onClick={() => {
                this.props.onCancel();
              }}
            >
              取消
            </div>
            <div
              style={style.confirm}
              onClick={() => {
                this.props.onConfirm( {pass: this.state.selectedOption}); 
              }}
            >
              确定
            </div>
          </div>
          <div style={style.mid}>
            {
              opt
            }
          </div>
        
        </div>
      </div>
    );
  }
}

Panel.propTypes = {
  show: PropTypes.bool.isRequired,
  onCancel: PropTypes.func.isRequired,
  // label: PropTypes.string.isRequired,
  minYear: PropTypes.number,
  maxYear:PropTypes.number,
  defaultIndex: PropTypes.array,
  onConfirm: PropTypes.func.isRequired,
  type: PropTypes.string
};


export default Panel;